<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
    <title>CKEditor 5 ClassicEditor build</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/png" href="https://c.cksource.com/a/1/logos/ckeditor5.png">
    <!--    <link rel="stylesheet" type="text/css" href="styles.css">-->
</head>
<body>

<div class="editor">
    <h2>
        文章标题
    </h2>
    <p>
        文章内容
    </p>
    <p>
        <span style="color:hsl(0, 0%, 60%);">dfsadfas</span>
    </p>
</div>

<script src="../build/ckeditor.js"></script>
<script>
    ClassicEditor.create(document.querySelector('.editor'), {
        licenseKey: '',
        indentBlock: {offset: 1, unit: 'em'},
        fontSize: {options: [9, 11, 12, 'default', 16, 18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40]},
        fontFamily: {
            options: [
                'default',
                '微软雅黑, Microsoft YaHei',
                '新宋体, NSimSun',
                '宋体, SimSun',
                '仿宋, FangSong',
                '楷体, KaiTi',
                '黑体, SimHei',
                'Arial, Helvetica, sans-serif',
                'Tahoma, Geneva, sans-serif',
                'Verdana, Geneva, sans-serif',
                'Courier New, Courier, monospace',
            ]
        },
    }).then(function (editor) {
        window.editor = editor;
        // console.log(editor)
        // editor.model.sourceElement.style
        // editor.model.document.on("change:data", function () {
        //     console.log(editor.getData())
        //     _this.$emit("change", editor.getData());
        // });
        setInterval(function () {
            console.log(editor.getData())
        }, 10000);
    }).catch(function (error) {
        console.error('Oops, something went wrong!');
        console.error('Please, report the following error on https://github.com/ckeditor/ckeditor5/issues with the build id and the error stack trace:');
        console.warn('Build id: yw6zhbblcdbg-b5dhd7ee5sv3');
        console.error(error);
    });
</script>
</body>
</html>